@page "/new"
@rendermode InteractiveServer
@inject NavigationManager Navigation
@using System.ComponentModel.DataAnnotations


<EditForm Model="@model" OnValidSubmit="OnValidSubmit">
    <DataAnnotationsValidator />
    <MudGrid>
        <MudItem xs="12" sm="7">
            <MudCard>
                <MudCardContent>
                    <MudTextField Label="Name" HelperText="Max. 8 characters" AutoFocus
                    @bind-Value="model.Name" For="@(() => model.Name)" />
                    <MudTextField Label="Commands" Lines="3" Variant="Variant.Outlined" ShrinkLabel AutoGrow Class="mt-3"
                    @bind-Value="model.CommandsAsString" For="@(()=>model.CommandsAsString)" />
                </MudCardContent>
                <MudCardActions>
                    <MudButton ButtonType="ButtonType.Submit" Variant="Variant.Filled" Color="Color.Primary" Class="ml-auto">Add</MudButton>
                </MudCardActions>
            </MudCard>
        </MudItem>
        <MudItem xs="12" sm="5">
            <MudPaper Class="pa-4 mud-height-full">
                <MudText Typo="Typo.subtitle2">Validation Summary</MudText>
                @if (success)
                {
                    <MudText Color="Color.Success">Success</MudText>
                }
                else
                {
                    <MudText Color="@Color.Error">
                        <ValidationSummary />
                    </MudText>
                }
            </MudPaper>
        </MudItem>
        <MudItem xs="12">
            <MudText Typo="Typo.body2" Align="Align.Center">
                Fill out the form correctly to see the success message.
            </MudText>
        </MudItem>
    </MudGrid>
</EditForm>


@code {
    Command model = new Command(0, "", []);
    bool success;

    private void OnValidSubmit(EditContext context)
    {
        CommandRepository.CreateCommand(model);
        Navigation.NavigateTo("/");
    }

}
